<template>
	<view>
		<view class="item" style="display: flex;border: 1px solid gray;" v-for="(item,index) in xianitems"
		  			@tap="toDetails(item.objectId)">
		  			<image :src="item.img" mode="" style="width: 200rpx;height: 150rpx;"></image>
		  			<view class="msg" style="width: 500rpx;">
		  				<view class="title">{{item.name}}</view>
		  				<view class="intro">{{item.intro}}</view>
		  			</view>
		  		</view>
	</view>
</template>

<script setup>
		import {
				ref
			} from 'vue'
			import {
				onLoad
			} from '@dcloudio/uni-app'
			import {
				CONFIG
			} from '../../utils/config';
			import {
				userStore
			} from '../../store/userstore.js';
			let store = userStore()
			onLoad(() => {
				getXianPost("1")
				getXianPost("2")
				getXianPost("3")
				getXianPost("4")
			})
			let xianitems = ref([])
			// 获取类别为1的景点
			async function getXianPost(type) {
				let data = {
					"type": type
				}
				let ed = encodeURI(JSON.stringify(data))
				let res = await uni.$get(CONFIG.leancloud_url + "/1.1/classes/xianplayitem?where" + ed)
				console.log(res)
				xianitems.value = res.results
			}
	
			function toDetails(id) {
				uni.navigateTo({
					url: "/pages/xianItemDetails/xianItemDetails?id=" + id
				})
			}
</script>

<style>
.category-nav {
  display: flex;
  justify-content: space-around;
  margin-bottom: 10px;
}

.category-item {
  padding: 5px 10px;
  border: 1px solid #ccc;
  cursor: pointer;
}

.category-item.active {
  border-color: #007aff;
  color: #007aff;
}

.item {
  margin-bottom: 10px;
}

.msg {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 10px;
}

.title {
  font-size: 16px;
  font-weight: bold;
}

.intro {
  font-size: 14px;
  color: #666;
}
</style>
